{include file="header.html"}
<script src="/js/ckeditor/ckeditor.js"></script>
<div class="page-header">
	<h6>
		文章管理
		<small>
			<i class="ace-icon fa fa-angle-double-right"></i>
			文章编辑
		</small>
	</h6>
</div>
<div class="row">
<div class="col-xs-12">
	<form class="form-horizontal" role="form" method="post" action="?app=article&act=edit" enctype="multipart/form-data">
		<input type="hidden" name="id" id="id" value="{$row->id}" />
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="title"> 标题 </label>
			<div class="col-sm-10">
				<input type="text" id="title" name="title" value="{$row->title}" class="col-xs-6" />
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="pic"> 主图片 </label>
			<div class="col-sm-10">
				<div class="col-file col-xs-3"><input type="file" id="pic" name="pic" value="" /></div>
				{if $row->pic}<a href="{$row->pic}" target="_blank"><img src="{$row->pic}" width="100" /></a>{/if}
				<input type="hidden" name="origin_pic" value="{$row->pic}" />
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="memo"> 摘要 </label>
			<div class="col-sm-10">
				<input type="text" id="memo" name="memo" value="{$row->memo}" class="col-xs-6" />
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="content"> 内容 </label>
			<div class="col-sm-10">
				<textarea class="ckeditor" name="content" id="content" style="width:95%" rows="50">{$row->content}</textarea>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="category_id"> 分类 </label>
			<div class="col-sm-10">
				<select name="category_id" id="category_id" class="form-control" style="width:150px;">
                    <option value="">请选所属分类</option>
					{foreach from=$categorys item=g}
					<option value="{$g->id}" {if $row->category_id == $g->id}selected{/if}>{$g->name}</option>
					{/foreach}
                </select>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="ext_property"> 扩展属性 </label>
			<div class="col-sm-10">
				<div class="checkbox">
					<label id="ext_property1">
						<input type="checkbox" name="ext_property[]" id="ext_property1" value="1" class="ace" {if strpos(','|cat:$row->ext_property|cat:',', ',1,')!==false }checked{/if}  />
						<span class="lbl"> 推荐</span>
					</label>
				</div>
				<div class="checkbox" >
					<label id="ext_property2">
						<input type="checkbox" name="ext_property[]" id="ext_property2" value="2" class="ace" {if strpos(','|cat:$row->ext_property|cat:',', ',2,')!==false }checked{/if}  />
						<span class="lbl"> 热门</span>
					</label>
				</div>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="status"> 是否显示 </label>
			<div class="col-sm-10">
				<div class="radio">
					<label>
						<input type="radio" name="status" value="1" class="ace"{if $row->status==1}checked{/if}  />
						<span class="lbl"> 是</span>
					</label>
				</div>
				<div class="radio">
					<label>
						<input type="radio" name="status" value="0" {if $row->status==0}checked{/if} class="ace" />
						<span class="lbl"> 否</span>
					</label>
				</div>
			</div>
		</div>
		
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="sort"> 文章排序 </label>
			<div class="col-sm-10">
				<input type="text" name="sort" id="sort" value="{$row->sort}" class="col-xs-2" />
				<span class="some-line">数字越小，排在越前</span>
			</div>
		</div>
		
		<!--<div class="form-group" >
			<label class="col-sm-2 control-label no-padding-right"><span class="btn-info btn-add" id="add">+</span> 关联商品</label>
			<div class="col-sm-10">
				<ul id="simple-table" class="goods-list col-sm-5">
					{foreach from=$goods item=g}
					<li class="item">
						<a class="del" href="javascript:void(0)">－</a>
						<a href="index.php?app=goods&act=edit&id={$g->id}" target="_blank">
							<div style="background-image:url({$g->pic});"></div>
							<span>{$g->name}</span>
							<font>￥{$g->price}</font>
						</a>
						<input type="hidden" class="goods_id" name="goods[]" value="{$g->id}" />
					</li>
					{/foreach}
				</ul>
			</div>
		</div>-->
		
		<!--<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right" for="files"> 上传相册 </label>
			<div class="col-sm-10">
				<div class="col-file col-xs-3" id="file"><input type="file" id="files" /></div>
				<div id="imgs">
					{if is_array($pics)}
					{foreach from=$pics item=g}
					<div>
						<span title="拖动改变顺序">≡</span>
						<a href="{$g->pic}" target="_blank" style="background-image:url({$g->pic});"></a>
						<input type="hidden" name="pics[]" value="{$g->pic}">
						<a href="javascript:void(0)" onclick="deletePic(this)"></a>
					</div>
					{/foreach}
					{/if}
				</div>
			</div>
		</div>-->
		
		<div class="form-group">
			<label class="col-sm-2 control-label no-padding-right"> 评论 </label>
			<div class="col-sm-10 comments">
				{if is_array($comments)}
				<ul>
					{foreach from=$comments item=g}
					<li>
						<div class="col-height">
							{$g->content} <span style="color:#ccc;">[{$g->add_time}]</span>
							<a class="reply-add" parent_id="{$g->id}" href="javascript:void(0)">回复</a>
						</div>
						<div class="reply-list">
							{if is_array($g->replys)}
							{foreach from=$g->replys item=r}
							<div>{$r->member_name}:{$r->content} <a class="reply-delete" self_id="{$r->id}" href="javascript:void(0)">删除</a></div>
							{/foreach}
							{/if}
						</div>
					</li>
					{/foreach}
				</ul>
				{else}
				<div class="col-height" style="color:#ccc;">暂无评论</div>
				{/if}
			</div>
		</div>

		<div class="clearfix form-actions">
			<div class="col-md-offset-3 col-md-9">
				<button class="btn btn-info" type="submit">
					<i class="ace-icon fa fa-check bigger-110"></i>
					提交
				</button>

				&nbsp; &nbsp; &nbsp;
				<button class="btn" type="reset">
					<i class="ace-icon fa fa-undo bigger-110"></i>
					重置
				</button>
			</div>
		</div>
	</form>
</div>
</div>
<script>
function deletePic(k){
	if(!confirm('是否删除？'))return;
	$(k).parent().remove();
	if($('#imgs').children().length<6)$('#file').show();
}
function setDragsort(){
	$('#imgs').dragsort({
		dragList : 'div',
		dragItem : 'span',
		//lockRange : true,
		placeHolder : '<div class="hold"></div>',
		start : function(){
			$('.hold').html(this.html()).attr('style', this.attr('data-style')).css({
				width:this.outerWidth(false),
				height:this.outerHeight(false),
				opacity:0.3
			});
		}
	});
}
$(function(){
	setDragsort();
	$('#simple-table').on('click', 'a.del', function(){
		$(this).parent().remove();
	});
	//添加图片
	$('#files').html5upload({
		url : '?app=article&act=upload_pic',
		name : 'pic',
		dataType : 'text',
		before : function(){
			if($('#imgs').children().length>=6){
				alert('图片不可超过6张');
				return false;
			}
			$.overload();
		},
		success : function(url){
			$.overload(false);
			var html = '<div>\
				<span title="拖动改变顺序">≡</span>\
				<a href="'+url+'" target="_blank" style="background-image:url('+url+');"></a>\
				<input type="hidden" name="pics[]" value="'+url+'" />\
				<a href="javascript:void(0)" onclick="deletePic(this)"></a>\
			</div>';
			$('#imgs').append(html);
			if($('#imgs').children().length>=6)$('#file').hide();
			setDragsort();
		}
	});
	
	$(document.body).on('click', 'a.reply-add', function(){
		var parent_id = $(this).attr('parent_id');
		var html = $('<div><input type="text" placeholder="请填写回复内容" style="width:33%;" /> <a href="javascript:void(0)">提交</a></div>');
		$(this).parent().next().append(html);
		html.opacityIn(500).find('a').click(function(){
			var div = $(this).parent(), content = $(this).prev().val();
			if(!content.length){
				alert('请填写回复内容');
				return;
			}
			$.postJSON('?app=article&act=reply_add', { parent_id:parent_id, content:content, article_id:'{$row->id}' }, function(json){
				if(json.error!=0){ alert(json.msg);return }
				var g = json.data;
				div.html(g.member_name+':'+g.content+' <a class="reply-delete" self_id="'+g.id+'" href="javascript:void(0)">删除</a>');
			});
		});
	});
	$(document.body).on('click', 'a.reply-delete', function(){
		if(!confirm('真的删除吗？'))return;
		var _this = $(this), id = _this.attr('self_id');
		$.postJSON('?app=article&act=reply_delete', { id:id }, function(json){
			if(json.error!=0){ alert(json.msg);return }
			_this.parent().removeOut(500);
		});
	});
	
    $('#add').click(function(){
		var style = '', win = $.window();
		if(win.width<=768)style = 'style="width:'+win.width+'px;height:'+win.height+'px;"';
		var html = '<div class="goods" '+style+'>\
			<div class="goods-title"><a href="javascript:void(0)">×</a>搜索商品</div>\
			<input type="text" class="keywords" placeholder="输入商品关键字后回车进行搜索" />\
			<ul class="goods-list"></ul>\
		</div>';
        $.overlay(html, 0, null, function(){
			$('.goods .goods-list').stopScroll(false);
		});
		$('.goods .goods-title a').click(function(){
			$.overlay(false);
		});
		$('.goods .goods-list').stopScroll(true);
		$('.goods .keywords').onkey({
			callback : function(code){
				if(code==13){
					var _this = $(this);
					if(!_this.val().length){ alert('请输入关键字');return }
					$.getJSON('api.php?app=goods&act=index&keyword='+_this.val(), function(json){
						if(json.error!=0){ alert('请输入关键字');return }
						if(!$.isArray(json.data.rs)){ alert('搜索不到相关商品');return }
						var html = '';
						for(var i=0; i<json.data.rs.length; i++){
							html += '<li class="item">\
								<a href="javascript:void(0)">\
									<div style="background-image:url('+json.data.rs[i].pic+');"></div>\
									<span>'+json.data.rs[i].name+'</span>\
									<font>￥'+json.data.rs[i].price+'</font>\
								</a>\
							</li>';
						}
						$('.goods .goods-list').html(html);
						$('.goods .goods-list a').each(function(i){
							$(this).data('data', json.data.rs[i]).click(function(){
								//$.overlay(false);
								var data = $(this).data('data'), hasGoods = false;
								$('.goods_id').each(function(){
									if(Number($(this).val())==Number(data.id)){
										hasGoods = true;
										return false;
									}
								});
								if(hasGoods)return;
								var html = '<li class="item">\
									<a class="del" href="javascript:void(0)">－</a>\
									<a href="index.php?app=goods&act=edit&id='+data.id+'" target="_blank">\
										<div style="background-image:url('+data.pic+');"></div>\
										<span>'+data.name+'</span>\
										<font>￥'+data.price+'</font>\
									</a>\
									<input type="hidden" class="goods_id" name="goods[]" value="'+data.id+'" />\
								</li>';
								$('#simple-table').append(html);
							});
						});
					});
				}
			}
		});
    });
});
</script>
{include file="footer.html"}